// 引入 react-redux 连接器
import { connect } from 'react-redux'
// 引入 UI 组件
import Count from '../../component/Count'

import {
  createIncrementAction,
  createDecrementAction,
  createIncrementAsyncAction
} from '../../redux/count_action'

const mapStateToProps = (state) => ({
  count: state
})

const mapDispatchToProps = (dispatch) => {
  return {
    jia: (num) => dispatch(createIncrementAction(num)),
    jian: (num) => dispatch(createDecrementAction(num)),
    jiaAsync: (num, time) => dispatch(createIncrementAsyncAction(num, time))
  }
}

// 导出创建的容器组件
// 注意：
// 1. connect() 第一次调用的时候，必须传入两个参数，且参数必须为函数
// 2. 参数返回值必须是 object 对象（react-redux 会自动把对象解构放入 props 中）
//    第一个参数：为要保存的状态，state 为 reducer 中定义的状态（初次渲染时会以默认状态展示）
//    第二个参数：为操作状态的方法
export default connect(mapStateToProps, mapDispatchToProps)(Count)
